<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>商品列表</title>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/shopping_list.css" />
    <script type="text/javascript" src="../js/jQuery.min.js"></script>
    <script type="text/javascript" src="../js/template.js"></script>
    <script type="text/javascript" src="../js/underscore.js"></script>
    <script type="text/javascript" src="../js/common.js"></script>
    <script type="text/javascript" src="../js/shopping_list.js"></script>

    <script id="tpl" type="text/html">
        <%for(var i = 0; i < list.length; i++) {%>
        <tr>
            <td><%:=list[i].type%></td>
            <td><%:=list[i].name%></td>
            <td><%:=list[i].price%></td>
            <td><%:=list[i].unit%></td>
            <td><button id=<%:=list[i].barcode%> onclick="addItemToCart()">加入购物车</button></td>
        </tr>
        <%}%>
    </script>

</head>
<body>
<div class="nav">
    <ul>
        <li><a href="index.html">Let's Go</a></li>
        <li><a href="index.html">主页</a></li>
        <li><a class="shopping" href="#">商品列表</a></li>
        <li>
            <a href="cart_list.html">
                <img src="../image/cart.png" />
                <p id="cart_num">购物车(0)</p>
            </a>
        </li>
    </ul>
</div>
<div class="content">
    <div class="title">商品列表</div>
    <div class="split-line"></div>
    <div class="shopping-info">
        <table border="1">
            <thead>
                <th>分类</th>
                <th>名称</th>
                <th>单价</th>
                <th>单位</th>
                <th></th>
            </thead>
            <tbody id="shopping_list_info">

            </tbody>
        </table>
    </div>
</div>
</body>
</html>